<template>
  <div>
    <van-form ref="form">
      <van-field
        v-model="formData.activeName"
        autocomplete="off"
        clearable
        required
        name="活动名称"
        label="活动名称"
        placeholder="活动名称"
        :rules="rules.activeName"
      />
      <van-field
        readonly
        clickable
        name="活动时间"
        is-link
        label="活动时间"
        required
        :value="formData.activeTime"
        placeholder="请选择活动时间"
        @click="dateShow = true"
        :rules="rules.activeTime"
      />
      <van-popup v-model="dateShow" position="bottom">
        <van-datetime-picker
          v-model="pickerTime"
          :min-date="minDate"
          :max-date="maxDate"
          type="datetime"
          @confirm="onConfirm"
        />
      </van-popup>
      <van-field
        v-model="formData.activeAddr"
        autocomplete="off"
        clearable
        required
        name="活动地点"
        label="活动地点"
        placeholder="活动地点"
        :rules="rules.activeAddr"
      />
      <van-field
        v-model="formData.activePeropleNumer"
        name="活动人数"
        label="活动人数"
        maxlength="8"
        clearable
        required
        placeholder="请输入活动人数"
        :rules="rules.activePeropleNumer"
      />
      <van-field name="uploader" label="活动措施">
        <template #input>
          <uploadCom
            ref="uploadRef"
            @uploadFileIds="handleUploadAtMeasures"
            :defaultFiles="measureDefaultFiles"
          ></uploadCom>
        </template>
      </van-field>
      <van-field name="uploader" label="活动人员名单">
        <template #input>
          <uploadCom
            ref="uploadRefPeople"
            @uploadFileIds="handleUploadAtPeople"
            :defaultFiles="userDefaultFiles"
          ></uploadCom>
        </template>
      </van-field>
      <van-button class="defaultBtn" @click="handleSave">保存</van-button>
    </van-form>
    <fullLoading v-if="loading"></fullLoading>
  </div>
</template>
<script>
import { saveActivityReport } from "@/api/srvAssurance/epidprevention/activity/activity";
export default {
  data() {
    return {
      pickerTime: new Date(), //时间选择默认当前时间
      dateShow: false, //时间picker
      minDate: new Date(new Date().getFullYear() - 1, 0, 1),
      maxDate: new Date(new Date().getFullYear(), 11, 31),
      formData: {
        activeId: "", // 活动报备标识
        activeName: "", // 活动名称
        activeTime: "", // 活动时间
        activeAddr: "", // 活动地点
        activePeropleNumer: "", //活动人数
        activeFileIds: "",
        activeUserFileIds: "",
      },
      rules: {
        activeName: [
          { required: true, message: "请输入活动名称", trigger: "onBlur" },
        ],
        activeTime: [
          {
            required: true,
            message: "请选择活动时间",
            trigger: "onChange",
          },
        ],
        activePeropleNumer: [
          { required: true, message: "请填写活动人数", trigger: "blur" },
          {
            pattern: /^[0-9]+$/,
            message: "活动人数只能为正整数",
            trigger: "onBlur",
          },
        ],
        activeAddr: [
          { required: true, message: "请填写活动地点", trigger: "blur" },
        ],
      },
      isEdit: false,
      loading: false,
      measureDefaultFiles: [], // 活动措施附件
      userDefaultFiles: [], // 活动人员附件
      reportFile: [],
      deleteAttachIdArr: [],
      checkedArr: [],
    };
  },
  mounted() {},
  methods: {
    // 保存
    handleSave() {
      this.loading = true;
      this.$refs.form
        .validate()
        .then(async () => {
          let formData = { ...this.formData };
          if (!this.isEdit) {
            // 新增
            delete formData.activeId;
          }
          //新增或修改基本信息
          this.loading = false;
          let res = await saveActivityReport(formData);
          if (res.code == "1000") {
            this.$Notify({ type: "success", message: "保存成功！" });
            this.$emit("close");
            this.$emit("refresh");
          } else {
          }
        })
        .catch(() => {
          this.loading = false;
        });
    },
    // 查询原本信息
    getData(obj) {
      this.isEdit = true;
      for (var key in this.formData) {
        if (obj[key] || obj[key] === 0) {
          this.formData[key] = obj[key];
        }
      }
      this.pickerTime = new Date(obj.activeTime);
    },
    // 查询活动措施附件信息
    getFileData(file) {
      this.measureDefaultFiles = [];
      this.measureDefaultFiles = file;
      // this.$refs.uploadRef.bindDefaultFiles(file);
    },
    // 查询活动人员附件信息
    getFileDataPeople(file) {
      this.userDefaultFiles = [];
      this.userDefaultFiles = file;
      // this.$refs.uploadRefPeople.bindDefaultFiles(file);
    },
    // 活动时间选择
    onConfirm(date) {
      this.formData.activeTime = new Date(date).format("yyyy-MM-dd hh:mm");
      this.dateShow = false;
    },
    // 活动措施上传
    handleUploadAtMeasures(arr) {
      this.formData.activeFileIds = arr.join();
    },
    // 活动人员名单上传
    handleUploadAtPeople(arr) {
      this.formData.activeUserFileIds = arr.join();
    },
    // 重置表单
    resetForm() {
      this.formData = {
        activeId: "", // 活动报备标识
        activeName: "", // 活动名称
        activeTime: "", // 活动时间
        activeAddr: "", // 活动地点
        activePeropleNumer: "", //活动人数
        activeFileIds: "",
        activeUserFileIds: "",
      };
      this.measureDefaultFiles = [];
      this.userDefaultFiles = [];
      this.isEdit = false;
      this.$refs.uploadRef.reset();
      this.$refs.uploadRefPeople.reset();
      setTimeout(() => {
        this.$refs.form.resetValidation();
      });
    },
  },
};
</script>
